<template>
	<div class="app-container" v-loading="loading" element-loading-text="加载中">
		<el-row :style="{ flexGrow: 1, overflowY: 'auto' }">
			<!-- 中间可滑动的区域 -->
			<OrderUnity :showall=true :isedit=true ref="orderUnity">
			</OrderUnity>
		</el-row>
		<el-row>
			<el-col :span="24" style="position: fixed; bottom: 0; width: 100%; z-index:100;">
				<!-- 底部固定的区域 -->
				<el-form ref="form" label-position="top" label-width="80px" style="padding: 20px;background-color: white;">
					<el-form-item label="团队成员" style="text-align: center;">
						<el-table :data="member_list" :border="true" show-summary style="width: 100%">

							<el-table-column label="名字" width="auto">
								<template slot-scope="scope">
									<el-select v-model="scope.row._id" placeholder="名字">
										<el-option v-for="item in user_list" :key="item._id" :label="item.name"
											:value="item._id">
										</el-option>
									</el-select>
								</template>
							</el-table-column>

							<el-table-column label="操作" width="80pt">
								<template slot-scope="scope">
									<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">
										删除</el-button>
								</template>
							</el-table-column>

						</el-table>
						<el-button size="mini" type="danger" @click="handleAdd()">添加成员</el-button>
						<el-button size="mini" type="danger" @click="handleFinish()">完成</el-button>
					</el-form-item>
				</el-form>



			</el-col>
		</el-row>
	</div>
</template>

<script>
import Api from '../../api/api'
import OrderUnity from '../../components/orderunity.vue'
export default {
	components: {
		OrderUnity,
	},
	data() {
		return {
			def_role_id: 0,
			user_list: [],
			member_list: [],
			loading: false
		}
	},

	methods: {
		onLoad(e) {
			console.log(e._id)
			this.getUsers(e).then(response => {
				if (response.status == 200) {
					this.getWorkOrders(e).then(response => {
					})
				}
			})
		},
		getUsers(e) {
			return Api.getUsers().then(response => {
				console.log(response.data)
				if (response.status == 200) {
					this.user_list = response.data.data.reduce((obj, item) => {
						if (this.def_role_id == 0)
							this.def_role_id = item._id
						obj[item._id] = item;
						return obj;
					}, {});
				}
				return response
			})
		},
		getWorkOrders(e) {
			return Api.getWorkOrders({ search: { _id: e._id } }).then(response => {
				console.log("response", response.data)
				if (response.status == 200) {
					if (response.data.data[0].member_list)
						this.member_list = response.data.data[0].member_list
					this.$refs.orderUnity.setFormData(response.data.data[0]);
				}
				return response
			})
		},
		handleAdd() {

			this.member_list.push({
				_id: this.def_role_id,
			})
		},
		handleDelete(index, data) {
			console.log(index, data);
			this.member_list.splice(index, 1)
		},
		handleFinish() {
			this.loading = true
			let formData = this.$refs.orderUnity.getFormData();
			formData.member_list = this.member_list
			if (formData.member_list.length == 0) {
				this.$message.success("团队成员不能为空");
			}
			else {
				console.log(formData)
				let mentioned_mobile_list = []
				for (var i = 0; i < formData.member_list.length; i++) {
					let memberid = formData.member_list[i]._id
					let user = this.user_list[memberid]
					mentioned_mobile_list.push(user.phone)
				}

				let content = "你有一个工单任务" +
					"\n客户:" + formData.customer.name +
					"\n地址:" + formData.customer.address +
					"\n联系:" + formData.customer.contact +
					"\n问题:" + formData.problem +
					"\n连接:" + Api.baseWebUrl + "#/pages/tabbar/orders/orders?order_id="+formData._id
				let message = {
					"msgtype": "text",
					"text": {
						"content": content,
						"mentioned_mobile_list": mentioned_mobile_list
					}
				}
				console.log(message)
				Api.sendGroupMessages(message).then(response => {
					console.log(response.data)
					if (response.status == 200) {
						formData.assignee = this.$Global.user._id
						formData.repairman = this.user_list[formData.member_list[0]._id]._id
						formData.status = 1
						Api.updaWorkOrders({ id: formData._id, date: formData }).then(response => {
							console.log(response.data)
							if (response.status == 200) {
								uni.reLaunch({
									url: '/pages/tabbar/orders/orders?status=0'
								})
							}
							this.$message.success(response.data.message);
						})
					}
					this.loading = false
				})

			}

		}
	}
}
</script>

<style>
.app-container {
	display: flex;
	flex-direction: column;
	height: 100%;
}
</style>
